<template>
  <div class="my-body">
    <div class="ipt_a">
      <div style="float: left; line-height: 30px" class="tab_font-size">
        经销商用户ID：
      </div>
      <el-input
        v-model="input"
        placeholder="请输入内容"
        style="width: 150px; height: 50px; float: left"
      ></el-input>
    </div>

    <div class="ipt_a">
      <div style="float: left; line-height: 30px" class="tab_font-size">
        经销商名称：
      </div>
      <el-input
        v-model="input"
        placeholder="请输入内容"
        style="width: 150px; height: 50px; float: left"
      ></el-input>
    </div>

    <div>
      <el-button type="primary" plain>查询</el-button>
      <el-button>清空</el-button>

      <div style="margin-top: 30px">
        <div>
          <el-button type="primary" @click="area = true" plain>添加</el-button>
          <el-button type="danger" plain>删除</el-button>
          <el-button type="primary" plain>CSV数据导出</el-button>
        </div>
        <el-dialog
          title="添加经销商用户"
          :visible.sync="area"
          width="50%"
          :before-close="handleClose"
        >
          <div style="width: 100%">
            <el-form ref="form" :model="form" label-width="150px">
              <el-form-item label="企业">
                <el-input v-model="form.qiyecode" style="width: 100px"></el-input>
                <!-- 	<el-input v-model="form.name" style="width:200px;"></el-input> -->
                <el-select
                  v-model="form.qydata"
                  placeholder="请选择授权状态"
                 @change="AddSelectDept"
				  value-key="id"
                >
                  <el-option v-for="item in jxsdata"  :value="item" :label="item.name" :key="item"></el-option>
                  
                </el-select>
              </el-form-item>
              <el-form-item label="角色ID">
                <el-input v-model="form.name" style="width: 200px"></el-input>
                <el-button type="primary" style="margin-left: 20px"
                  >申请</el-button
                >
              </el-form-item>
              <el-form-item label="用户名称">
                <el-input v-model="form.name" style="width: 200px"></el-input>
                <el-checkbox
                  label="账期订单"
                  name="type"
                  style="margin-left: 20px"
                ></el-checkbox>
              </el-form-item>
              <el-form-item label="口令">
                <el-input v-model="form.name" style="width: 200px"></el-input>
              </el-form-item>

              <el-form-item label="重复口令">
                <el-input v-model="form.name" style="width: 200px"></el-input>
              </el-form-item>
              <el-form-item label="备注">
                <el-input v-model="form.name" style="width: 200px"></el-input>
              </el-form-item>
              <el-form-item>
                <el-button style="width: 200px">返回</el-button>
                <el-button style="width: 200px" type="primary">添加</el-button>
              </el-form-item>
            </el-form>
          </div>
        </el-dialog>
        <template>
          <el-table
            :data="
              tableData.slice(
                (currentPage - 1) * pageSize,
                currentPage * pageSize
              )
            "
            border
            :header-cell-style="{ background: '#f5f7fa', color: '#606266' }"
            style="width: 100%; margin-top: 30px"
          >
            <el-table-column fixed prop="admin_group_id" label="用户ID">
            </el-table-column>
            <el-table-column prop="company_name" label="经销商名称">
            </el-table-column>
            <el-table-column prop="company_code" label="企业编号"> </el-table-column>
            <el-table-column prop="name" label="经销商资质">
              <el-button>经销商资质</el-button>
            </el-table-column>
            <el-table-column prop="province" label="营业执照有效期">
            </el-table-column>
            <el-table-column prop="address" label="经营许可证有效期">
            </el-table-column>
            <el-table-column prop="mobile" label="联系方式">
              <!-- <el-button>联系方式</el-button> -->
			 
            </el-table-column>
            <el-table-column prop="shouqfang" label="最后登录时间">
            </el-table-column>
            <el-table-column prop="remark" label="备注"> </el-table-column>
          </el-table>
          <el-pagination
            @size-change="handleSizeChange"
            @current-change="handleCurrentChange"
            :current-page="currentPage"
            :page-sizes="[5, 10]"
            :page-size="pageSize"
            :total="tableData.length"
            layout="total, sizes, prev, pager, next, jumper"
          >
          </el-pagination>
        </template>
      </div>
    </div>
  </div>
</template>

<script>
import { getData, postData } from "@/utils/request.js";
export default {
  data() {
    return {
      area: false,
      tablisty: false,
      tablistya: false,
      tablistyb: false,
      key: 1, // 为了能每次切换权限的时候重新初始化指令
      options: [
        {
          value: "1",
          label: "全部",
        },
        {
          value: "2",
          label: "一般订单",
        },
        {
          value: "3",
          label: "积分订单",
        },
        {
          value: "3",
          label: "样品订单",
        },
        {
          value: "3",
          label: "换货订单",
        },
      ],
      value1: "",
      value2: "",
      value3: "",
      form: {
		qiyeid:"",
		qydata:"",
		qiyecode:"",
        name: "",
        region: "",
        date1: "",
        date2: "",
        delivery: false,
        type: [],
        resource: "",
        desc: "",
      },
      currentPage: 1,
      pageSize: 5,
      radio: "授权医院",
      value: "",
      tableData: [],
      checkAll: false,
      checkedCities: [],
      cities: [
        "房间隔缺损",
        "室间隔缺损",
        "介入输送装置",
        "动脉导管未闭",
        "抓捕器",
      ],
      isIndeterminate: true,
	  jxsdata:[],
    };
  },
  created(){
      this.list()
	  this.jxslist()
  },
  methods: {
	AddSelectDept(val){
          console.log(val)
		  this.form.qiyeid = val.id
		  this.form.qydata = val
		  this.form.qiyecode = val.company_code
	},
	//经销商列表
	
	jxslist(){
		var data = {
       
	   token: localStorage.getItem("token"),
	 };
	 postData("company/indexList", data).then((res) => {
	   console.log(res);
		this.jxsdata =res.data.data
	 });
	},
    list() {
      var data = {
       
        token: localStorage.getItem("token"),
      };
      postData("company/adminList", data).then((res) => {
        console.log(res);
         this.tableData =res.data.data
      });
    },
    handleClick(row) {
      console.log(row);
    },
    handleCheckAllChange(val) {
      const cityOptions = ["上海", "北京", "广州", "深圳"];
      console.log(val);
      this.checkedCities = val ? cityOptions : [];

      this.isIndeterminate = false;
    },
    handleCheckedCitiesChange(value) {
      let checkedCount = value.length;
      this.checkAll = checkedCount === this.cities.length;
      this.isIndeterminate =
        checkedCount > 0 && checkedCount < this.cities.length;
    },
  },
};
</script>

<style lang="scss" scoped>
.ipt_a {
  width: 300px;
  height: 50px;
  float: left;
}

.ipt_b {
  width: 450px;
  height: 50px;
  float: left;
}
.el-table {
  height: calc(100vh - 282px);
}
</style>